import type { VNode, DefineComponent } from "vue";

import type {
  InputProps as ElInputProps,
  SelectProps as ElSelectProps,
  CascaderProps as ElCascaderProps,
  DatePickerProps as ElDatePickerProps,
  InputNumberProps as ElInputNumberProps,
} from "element-plus";

declare namespace SForm {
  /**
   * 表单验证规则
   */
  interface FormItemRule {
    required?: boolean;
    message?: string;
    trigger?: string | string[];
    validate?: any;
  }
  /**
   * 异步加载配置项
   */
  interface AsyncLoadOption {
    api: (params?: any) => Promise<any>;
    params?: Record<string, any>;
    immediate?: boolean;
    dependOn?: string[]; // 联动字段名
  }
  /**
   * 响应式布局配置
   */
  interface FormItemLayout {
    span?: number;
    xs?: number;
    sm?: number;
    md?: number;
    lg?: number;
    xl?: number;
  }
  /**
   * 组件选项（如 select 的 data）
   */
  interface FormItemOption {
    label?: string;
    fieldLabel?: string;
    fieldKey?: string;
    data?: any[];
    props?: Record<string, any>;
  }

  /**
   * 自定义渲染函数类型
   */
  type RenderFunction = (h: any, formData: Record<string, any>) => VNode;

  /**
   * 基础表单项配置
   */
  interface BaseFormItemConfig {
    el?: string | DefineComponent; // 可传入组件名称或组件本身
    prop: string;
    label?: string;
    rules?: FormItemRule[];
    defaultValue?: any;
    options?: FormItemOption;
    layout?: FormItemLayout;
    asyncLoad?: AsyncLoadOption;
    componentType?: "default" | "custom";
    render?: RenderFunction; // 新增：支持使用 h 渲染
    [key: string]: any; // 支持扩展任意属性
  }
  /**
   * 具体组件类型的扩展配置
   */
  interface InputFormItemConfig extends BaseFormItemConfig {
    el: "el-input";
    props?: ElInputProps;
  }
  interface SelectFormItemConfig extends BaseFormItemConfig {
    el: "el-select";
    props?: ElSelectProps;
  }
  interface CascaderFormItemConfig extends BaseFormItemConfig {
    el: "el-cascader";
    props?: ElCascaderProps;
  }
  interface DatePickerFormItemConfig extends BaseFormItemConfig {
    el: "el-date-picker";
    props?: ElDatePickerProps;
  }
  interface InputNumberFormItemConfig extends BaseFormItemConfig {
    el: "el-input-number";
    props?: ElInputNumberProps;
  }
}
/**
 * 最终联合类型，用于表示所有支持的表单项配置
 */
type SFormConfig =
  | SForm.InputFormItemConfig
  | SForm.SelectFormItemConfig
  | SForm.CascaderFormItemConfig
  | SForm.DatePickerFormItemConfig
  | SForm.InputNumberFormItemConfig;

export { SForm, SFormConfig };
